/*后期可考虑将所有less文件统一打包至一个css文件中，html文件引用即可*/
.iconfont{
  cursor: pointer;
  //vertical-align: sub;
}
/*------------------------------common css-----------------------------------*/
//颜色：
@pay-color:#8890a3;
@title-color:#204659;  //标题正文颜色    //图标默认颜色
@theme-color:#fd8900;   //用于整体风格的识别以及激活元素（菜单、选项卡等）积极行为的按钮
//@background-color:#ebebeb;
@background-color:#eceef2;
@tb-color:#eef3fc;   //容器内填充区域颜色
@btn-word:#868ea2;   //辅助说明文字颜色
//字体的大小
@ft-one:12px;
@ft-et:18px;
@ft-four:20px;

html,body{
  background-color: @background-color;
  height: 100%;
  overflow-y: hidden;
  font-family: "Helvetica Neue", "Luxi Sans", "DejaVu Sans", Tahoma, "Hiragino Sans GB", STHeiti, "Microsoft YaHei";
}
input{
  outline:none !important;
}
a{
  cursor: pointer;
  color:@theme-color;
}
ul{
  padding-left: 0;
}
li{
  list-style: none;
}
header{
  border-bottom:1px solid #e2ebef !important;
  #rem.custom-property(height, 50px);
}
//去除label标签自带的字体加粗样式
label{
  font-weight: normal;
}
.breadcrumb{
  background-color: transparent !important;
}
.s1-container{//区块css
  background-color: white;
  #rem.padding-margin-short(padding, 18px, 25px);
  //#rem.custom-property(padding, 30px);
  #rem.padding-margin-short(margin, 10px, 15px);
  //box-shadow: 0px 2px 2px rgba(143,150,164,0.1);
  color: @title-color;
}
.s1-container-padding{//区块css
  #rem.padding-margin-short(padding, 0, 15px);
}
//区块内容
.s1-container-content{//区块内容区
  background: #fff;
  #rem.padding-margin-short(padding, 0, 15px);
}
.s1-container-no-top{//区块css
  background-color: white;
  #rem.padding-margin(padding, 10px, 0, 10px, 0);
}
.container-title{//区块title
  .s1-container;
  .bold;
  border-bottom: 1px solid #e2ebef;
  #rem.custom-property(margin-bottom, -10px);
  box-shadow: 0px 2px 2px rgba(143,150,164,0.1);
  //#rem.custom-property(font-size, 16px);
}
.contaner_desc{//区块说明文字
  #rem.custom-property(font-size,@ft-four);
  color:@title-color;
}
//变成行内元素
.dib{
  display: inline-block;
}
//字体加粗
.bold{
  font-weight: bold;
}
// 用于引导页的营业日时间选择和店铺信息修改中营业日时间选择
.c5{
  color: #555 !important; ;
}
//红色的*号
.label-red-i{
  color: #ff6161;
  vertical-align: middle;
  #rem.custom-property(margin-left, 5px);
}
//提示性浅灰色字体
.font-alert{
  #rem.custom-property( font-size, 12px);
  #rem.custom-property(margin-bottom,10px);
  color: @btn-word;
}
.ml20{
  #rem.custom-property-important(margin-left, 20px);
}
.mr20{
  #rem.custom-property-important(margin-right, 20px);
}
.mt10{
  #rem.custom-property-important(margin-top, 10px);
}
.mt20{
  #rem.custom-property-important(margin-top, 20px);
}
.mb10{
  #rem.custom-property-important(margin-bottom, 10px);
}
.mb20{
  #rem.custom-property-important(margin-bottom, 20px);
}
.w200{
  #rem.custom-property(width, 200px);
}
//公共按钮（背景色，悬浮背景色，点击背景色，字体色，点击时字体色,点击状态文字阴影，点击状态背景阴影）
.btn-our-self(@bgc,@bc,@click-bc,@font,@click-font,@click-fs,@click-bgc){
  outline: none;
  #rem.custom-property(height, 40px);
  #rem.custom-property(font-size, 18px);
  #rem.padding-margin-short(padding, 8px, 24px);
  #rem.custom-property(margin-top, 12px);
  #rem.custom-property-important(margin-bottom, 12px);
  #rem.custom-property(border-radius, 4px);
  #rem.custom-property(min-width, 90px);
  background-color: @bgc;
  color: @font;
  &:hover{
    background-color: @bc;
  }
  &:active {
    color: @click-font;
    background-color: @click-bc;
    text-shadow: 0px 1px 0px @click-fs;
    box-shadow: 0px 3px 4px @click-bgc inset;
  }
}
//侧滑编辑页中的公共样式
.btn-cancel{
  .btn-our-self(#fff,#f2fcff,#c8dce3,@btn-word,@btn-word,#f2fcff,rgba(133,165,176,0.3));
  border: 1px solid #dae4e8;
}
.btn-submit{
  .btn-our-self(@theme-color,#ea8004,#ea8004,#fff,#834701,#ffa944,rgba(36,70,100,0.3));
  border: 0;
}
//内容多出，高度出了滚动条，底部加上样式
.s1-footer-margin{
  z-index: 3;
  position: relative;
}
//seletTag按钮样式
.tag-our-btn(@width,@line,@tag-bg,@hover-bg){
    background-color:@tag-bg;
    #rem.custom-property(min-width,110px);
    #rem.padding-margin-short(padding,10px);
    #rem.custom-property(margin-bottom,10px);
    border: @width @line @background-color !important;
    color: @btn-word;
    -webkit-border-radius: 0;
    -moz-border-radius: 0;
    border-radius: 0;
    position: relative;
    border: 0;
    .bold;
    &:hover{
      color: #834701;
      background-color:@hover-bg;
    }
}
.tag-style{
  .tag-our-btn(1px,solid,@background-color,@background-color);
}

.tb{
  border-collapse: separate;
  .tb-head{
    background: @tb-color;
    color: @btn-word;
  }
  .tb-body td{
    #rem.custom-property(padding-top,15px);
    #rem.custom-property(padding-bottom,15px);
  }
  tbody>:nth-child(2) td{
    border-top:0 ;
  }
}
//消除行内元素之间的间隙
.inline-padding{
  font-size: 0;
  -webkit-text-size-adjust:none;
}
//输入框里的左侧图标
.form-control-left {
  position: absolute;
  top: 0;
  left: 0;
  z-index: 2;
  display: block;
  width: 46px;
  height: 40px;
  line-height: 40px;
  text-align: center;
  pointer-events: auto;
}
.input-auto{
  display: inline-block;
  width:auto;
}


//按钮位置
.btn-puta{
  position: absolute;
  #rem.custom-property(top, -1px);
  #rem.custom-property(right, 15px);
  z-index: 101;
}
.btn-putb{
  position: fixed;
  #rem.custom-property(top, -1px);
  #rem.custom-property(right, 30px);
  z-index: 21;
}

